<template>
  <div class="loading" v-show="$store.state.isLoading">
    <div class="load-box">
      <img class="loading-img" src="https://blog-chen.oss-cn-shanghai.aliyuncs.com/c14f3be6b163da84e102cd06afe3e612.gif"
        alt="Loading">
      <span>小鱼正带数据游来~~~</span>
    </div>
  </div>
</template>

<script>
  export default {
    computed: {
    },
    methods: {
    }
  };
</script>


<style scoped lang="less">
  .loading {
    width: 100%;
    height: 100%;
    position: fixed;
    background: white;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;

    .load-box {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;

      .loading-img {
        user-select: none;
        -webkit-user-drag: none;
      }

      span {
        margin-top: 1rem;
        font-size: 1rem;
        font-weight: bold;
      }
    }
  }
</style>